import React from 'react';
import { Popover, Card, Row, Col } from 'antd';
import styles from './popover_goods.less';

class Popover_goods extends React.Component {
  constructor(...args) {
    super(...args);
  }
  render() {
    const { msg } = this.props;
    let data_visit,
      data_Sales_Volume;
    if (msg) {
      const visit = msg.visit;
      const Sales_Volume = msg.Sales_Volume;

      data_visit = visit.map((item, key) => {
        const src = `http://wxcdn.meng.im/${item.cover_url}`;
        return (
          <Popover content={<p>{item.name}</p>} key={key}>
            <div className={styles.listChildren} >
              <img src={src} className={styles.listImg} />
              <p className={styles.callFont}>访问量：{item.count}</p>
            </div>
          </Popover>

        );
      });
      data_Sales_Volume = Sales_Volume.map((item, key) => {
        const src = `http://wxcdn.meng.im/${item.cover_url}`;
        return (

          <Popover content={<p>{item.name}</p>} key={key} >
            <div className={styles.listChildren}>
              <img src={src} className={styles.listImg} />
              <p style={{ textAlign: 'center' }}>销量：{item.count}</p>
            </div>
          </Popover>

        );
      });
    } else {
      data_visit = (<div />);
      data_Sales_Volume = (<div style={{ textAlign: 'center' }}>暂无数据</div>);
    }


    //   console.log(visit)
    // "http://wxcdn.meng.im/"


    return (
      <Card >
        <div>

          <div className={styles.listBack}>{data_visit}</div>


          <div className={styles.listBack}>{data_Sales_Volume}</div>

        </div>
      </Card>
    );
  }
}


Popover_goods.propTypes = {
};

export default Popover_goods;
